<template>
  <div class="app-container">
    <div class="container">
      <div class="user-center">
        <el-row :gutter="20">
          <el-col :span="6">
            <div class="user-menu">
              <el-menu
                default-active="/personal-data"
                class="el-menu-vertical-demo"
                router
              >
                <el-menu-item index="/personal-data">
                  <i class="el-icon-user"></i>
                  <span slot="title">个人资料</span>
                </el-menu-item>
                <el-menu-item index="/account-settings">
                  <i class="el-icon-setting"></i>
                  <span slot="title">账号设置</span>
                </el-menu-item>
                <el-menu-item index="4">
                  <i class="el-icon-lock"></i>
                  <span slot="title">隐私设置</span>
                </el-menu-item>
                <el-menu-item index="4">
                  <i class="el-icon-paperclip"></i>
                  <span slot="title">信息认证</span>
                </el-menu-item>
                <el-menu-item index="4">
                  <i class="el-icon-folder-opened"></i>
                  <span slot="title">我的收藏</span>
                </el-menu-item>
                <el-menu-item index="/browsing-history">
                  <i class="el-icon-time"></i>
                  <span slot="title">浏览历史</span>
                </el-menu-item>
                <el-divider></el-divider>
                <el-menu-item index="4">
                  <i class="el-icon-collection"></i>
                  <span slot="title">内容管理</span>
                </el-menu-item>
              </el-menu>
            </div>
          </el-col>
          <el-col :span="18">
            <router-view></router-view>
          </el-col>
        </el-row>
      </div>
    </div>
    <Foot></Foot>
  </div>
</template>

<script>
import Foot from '../../components/Foot.vue'
export default {
  components: {
    Foot
  },
  data() {
    return {
      baseInfoModel: {
        nickName: 'qq_42792430',
        userID: 'qq_42792430'
      },
      baseInfoFlag: false
    }
  },
  methods: {
    onSubmit() {
      console.log('submit!')
    }
  }
}
</script>

<style lang="less" scoped>
.app-container {
  padding-top: 20px;
  background: #f5f5f5;
}
.user-menu {
  margin-bottom: 16px;
  background: #fff;
  border-radius: 2px;
  border: 1px solid #f0f0f2;
  padding: 15px 0px;
}
</style>
